<template>
  <div class="page_header">
    <div class="user_avatar">
      <img src="@/assets/user_avatar.jpg" />
    </div>
    <select-region v-model="region" @goodsPageCall="handleGoodsPage"></select-region>
  </div>
</template>

<script setup>
import SelectRegion from "./SelectRegion.vue";
import {defineEmits, ref} from "vue";
const region = ref("320100");
const emit = defineEmits(["goodsPageCall"]);

const handleGoodsPage = (locationId) => {
  emit("goodsPageCall", locationId);
};
</script>
<style lang="scss" scoped>
.page_header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 10px 12px;
  .user_avatar {
    width: 50px;
    height: 50px;
    img {
      width: 50px;
      height: 50px;
      border-radius: 50px;
    }
  }
}
</style>
